<template>
    <div class="box_bg">
        <h2 class="box_tit">
            <i class="icon icon1"></i>课程表
            <i class="reti"></i>
        </h2>
        <div class="source">
            <!-- 查询 -->
            <div class="components_searchs clearfix" @keyup.enter="searchGetSyllabus">
                <div class="el-form demo-form-inline el-form--inline">
                    <div class="el-form-item">
                        <label class="el-form-item__label">学校：</label>
                        <div class="el-form-item__content">
                            <el-select v-model="searchForm.schoolId" clearable filterable placeholder="请选择学校" @change="changeSchool">
                              <el-option
                                v-for="item in options.schoolList"
                                :key="item.id"
                                :label="item.text"
                                :value="item.id">
                              </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="el-form-item">
                        <label class="el-form-item__label">学院：</label>
                        <div class="el-form-item__content">
                            <el-select v-model="searchForm.secondSchoolId" clearable filterable placeholder="请选择学院" @change="changeSecondSchool">
                              <el-option
                                v-for="item in options.secondSchoolList"
                                :key="item.id"
                                :label="item.text"
                                :value="item.id">
                              </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="el-form-item">
                        <label class="el-form-item__label">专业：</label>
                        <div class="el-form-item__content">
                            <el-select v-model="searchForm.professionId" clearable filterable placeholder="请选择专业" @change="changeProfession">
                              <el-option
                                v-for="item in options.professionList"
                                :key="item.id"
                                :label="item.text"
                                :value="item.id">
                              </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="el-form-item" style="padding-top: 4px;">
                        <el-button size="mini" type="primary" icon="el-icon-search" @click="searchGetSyllabus">查询</el-button>
                    </div>
                    <div class="el-form-item" style="padding-top: 4px;">
                        <el-button size="mini" type="primary" icon="el-icon-refresh" @click="resertSearch">重置</el-button>
                    </div>
                    <div class="el-form-item" style="padding-top: 4px;">
                        <el-button size="mini" type="primary" icon="el-icon-view"
                            @click="advancedSearchState=!advancedSearchState">高级搜索</el-button>
                    </div>
                </div>
                <div  v-if="advancedSearchState" class="components_searchs el-form demo-form-inline el-form--inline">
                    <div class="el-form-item">
                        <label class="el-form-item__label">学期：</label>
                        <div class="el-form-item__content">
                            <el-select v-model="searchForm.semester" clearable filterable placeholder="请选择学期">
                              <el-option
                                v-for="item in options.semesterList"
                                :key="item.id"
                                :label="item.label"
                                :value="item.id">
                              </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="el-form-item">
                        <label class="el-form-item__label">课程：</label>
                        <div class="el-form-item__content">
                            <el-input placeholder="请输入课程" v-model="searchForm.courseName" clearable></el-input>
                        </div>
                    </div>
                    <div class="el-form-item">
                        <label class="el-form-item__label">讲师：</label>
                        <div class="el-form-item__content">
                            <el-input placeholder="请输入讲师" v-model="searchForm.userName" clearable></el-input>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 按钮 -->
            <div class="components_btns  clearfix">
                <div class="fl">
                    <el-button type="primary" icon="el-icon-plus" size="mini"
                    v-has="'syllabus:create'"
                    v-loading.fullscreen.lock="fullscreenLoading"
                    @click="createBaseData">生成基础数据</el-button>
                    <!-- <el-button type="primary" icon="el-icon-plus" size="mini" >导入</el-button> -->
                </div>
               <!--  <div class="fr">
                    <a href="javascript: void(0);" class="link_txt" >下载导入模板</a>
                </div> -->
            </div>
            <!-- 表格 -->
            <el-table :data="syllabusTable" border style="width: 100%">
                <el-table-column :show-overflow-tooltip="true" prop="schoolName" align="center" label="学校"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" prop="secondSchoolName" align="center" label="学院"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" prop="professionName" align="center" label="专业"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" prop="grade" align="center" label="年级"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" prop="semester" align="center" label="学期"></el-table-column>
                <!-- <el-table-column :show-overflow-tooltip="true" prop="courseNo" align="center"  label="课程编号"></el-table-column> -->
                <el-table-column :show-overflow-tooltip="true" prop="courseName" header-align="center" label="课程名称"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" prop="userName" align="center" width="100" label="老师"></el-table-column>
                <el-table-column prop="" align="center" label="操作" fixed="right" width="250">
                    <template slot-scope="scope">
                        <el-button v-show="scope.row.state == 0"  v-has="'syllabus:config'" type="text" size="small" @click="showAddSyllabusDialog(scope.row)">配置课程</el-button>
                        <el-button v-show="scope.row.state == 1"  v-has="'syllabus:update'" type="text" size="small" @click="showEditSyllabusDialog(scope.row)">修改课程表</el-button>
                        <el-button v-show="scope.row.state == 1"  v-has="'syllabus:generate'" type="text" size="small" @click="showgenerateSyllabusDialog(scope.row.professionId,scope.row.id)">生成课程表</el-button>
                        <!-- <el-button v-show="scope.row.state == 2 || scope.row.state == 1" type="text" size="small" @click="resetSyllabus(scope.row)">重置课程表</el-button> -->
                        <el-button v-show="scope.row.state == 2"  v-has="'syllabus:reset'" type="text" size="small" @click="resetSyllabus(scope.row)">重置课程表</el-button>
                        <el-button v-show="scope.row.state == 2"  v-has="'syllabus:change'" type="text" size="small" @click="showsyllabusChangCourse(scope.row)">调课</el-button>
                        <el-button v-show="scope.row.state == 2" type="text" size="small" @click="showsyllabusAddLesson(scope.row)">增加堂课</el-button>
                        <el-button v-show="scope.row.state == 2"  v-has="'syllabus:detail'" type="text" size="small" @click="showgeneratesyllabusDetails(scope.row)">查看明细</el-button>

                    </template>
                </el-table-column>
            </el-table>
            <!-- 分页 -->
            <div class="paginationBox">
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="page.currentPage"
                    :page-sizes="[15, 30, 50, 100]"
                    :page-size="page.visiblePages"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="page.totalSize">
                </el-pagination>
            </div>
        </div>
        <syllabus-add @refreshList="getSyllabus" ref="syllabusAdd"></syllabus-add>
        <syllabus-edit @refreshList="getSyllabus" ref="syllabusEdit"></syllabus-edit>
        <syllabus-lesson @refreshList="getSyllabus" ref="syllabusLesson"></syllabus-lesson>
        <syllabus-create @refreshList="getSyllabus" ref="syllabusCreate"></syllabus-create>
        <syllabus-details @refreshList="getSyllabus" ref="syllabusDetails"></syllabus-details>
        <syllabus-chang-course @refreshList="getSyllabus" ref="syllabusChangCourse"></syllabus-chang-course>


    </div>
</template>

<script>
    import {enums} from '@/constant'
    import {config} from '@/config'
    import syllabus_add from './syllabus-add'
    import syllabus_edit from './syllabus-edit'
    import syllabus_create from './syllabus-create'
    import syllabus_lesson from './syllabus-lesson'
    import syllabus_details from './syllabus-details'
    import syllabus_chang_course from './syllabus-chang-course'
    export default {
        components: {
            "syllabus-add":syllabus_add,
            "syllabus-edit":syllabus_edit,
            "syllabus-create":syllabus_create,
            "syllabus-lesson":syllabus_lesson,
            "syllabus-details":syllabus_details,
            "syllabus-chang-course":syllabus_chang_course
        },
        data() {
            return {
                state: false,
                fullscreenLoading: false,
                advancedSearchState: false,
                dialogVisible: false,
                // 课程表表格
                syllabusTable: [],
                page:{
                    currentPage:0,
                    visiblePages:15,
                    totalSize:100
                },
                searchForm:{
                    schoolId:null,        //学校列表
                    secondSchoolId:null,  //院系列表
                    professionId:null,    //专业列表
                    semester:'',             //学期
                    courseName:'',
                    userName:''
                },
                options:{
                    schoolList:[],        //学校列表
                    secondSchoolList:[],  //院系列表
                    professionList:[],    //专业列表
                    semesterList:[]              //学期
                }
            };
        },
        created() { },
        mounted() {
            this.getSyllabus();
            this.getSchoolList();
            this.getSemesterList();
        },
        watch: {},
        methods: {
            //获取学校
            getSchoolList(){
                let vm = this;
                vm.axios.get(api.getSchoolList).then((response) => {
                    if (response.data.success) {
                        this.options.schoolList = JSON.parse(JSON.stringify(response.data.data));
                    } else {
                        vm.$message.error(response.data.msg);
                    }
                })
            },
            //学校监听
            changeSchool(schoolId){
                this.searchForm.secondSchoolId = null;
                this.searchForm.professionId=null;
                this.searchForm.classesIds=null;
                this.options.secondSchoolList = [];
                this.options.professionList = [];
                this.getSecondSchoolList(schoolId);
            },
            // 获取二级院系数据
            getSecondSchoolList(schoolId) {
                let vm = this;
                vm.axios.get(api.getSecondSchoolList,{
                    params: {
                        schoolId: schoolId
                    }
                }).then((response) => {
                    if (response.data.success) {
                        vm.options.secondSchoolList = JSON.parse(JSON.stringify(response.data.data));
                    } else {
                        vm.$message.error(response.data.msg);
                    }
                })
            },
            //二级学校监听
            changeSecondSchool(secondSchoolId){
                let schoolId = this.searchForm.schoolId;
                this.searchForm.professionId=null;
                this.searchForm.classesIds=null;
                this.options.professionList = [];
                this.getProfessionlList(schoolId,secondSchoolId);
            },
            //获取筛选后的专业
            getProfessionlList(schoolId,secondSchoolId){
                let vm = this;
                vm.axios.get(api.getProfeesionList, {
                     params: {
                        schoolId: schoolId,
                        secondSchoolId: secondSchoolId
                    }
                }).then((response) => {
                    if (response.data.success) {
                        this.options.professionList = JSON.parse(JSON.stringify(response.data.data));
                    } else {
                        vm.$message.error(response.data.msg);
                    }
                })
            },
            changeProfession(professionId){
                let schoolId = this.searchForm.schoolId;
                let secondSchoolId = this.searchForm.secondSchool;
                this.searchForm.classesIds=null;
                // this.getClassList(schoolId,secondSchoolId,professionId);
            },
            //获取学期的列表
            getSemesterList(){
                let self = this;
                self.axios({
                    method: "get",
                    url: api.dictsTypesSubListUrl,
                    params:{
                    "type":'semester_type'
                    }
                })
                .then(function(response) {
                    if(response.data.success){
                        // _.forEach(response.data.data,function(item){
                        //     item.value = item.value+"";
                        // })
                        self.options.semesterList = response.data.data;
                    }else{
                        self.$message({
                            duration: 1000,
                            message: response.data.msg,
                            center: true,
                            type: "error"
                        });
                    }
                })
            },
            //重置
            resertSearch(){
              let self = this;
              self.searchForm = {};
              // self.getTeacherWorkProgressManagerPaginationData();
              self.searchGetSyllabus();
            },
            // 搜索
            searchGetSyllabus(){
                let self = this;
                self.axios.get(api.syllabusManager.queryList, {
                     params: {
                        pageNum: self.page.currentPage,
                        pageSize: self.page.visiblePages,
                        schoolId: self.searchForm.schoolId,
                        secondSchoolId: self.searchForm.secondSchoolId,
                        professionId: self.searchForm.professionId,
                        semester: self.searchForm.semester,
                        courseName: self.searchForm.courseName,
                        userName: self.searchForm.userName
                     }

                }).then((response) => {
                    if (response.data.success) {
                        self.syllabusTable = JSON.parse(JSON.stringify(response.data.data.list));
                        self.page.totalSize = response.data.data.total;
                    } else {
                        self.$message.error(response.data.msg);
                    }
                })
            },
            //获取课程表数据
            getSyllabus(){
                var self = this;
                self.axios({
                    method: "get",
                    url: api.syllabusManager.queryList,
                    params: {
                        "pageNum": self.page.currentPage,
                        "pageSize": self.page.visiblePages
                    }
                }).then((response)=>{
                        if(response.data.success){
                            self.syllabusTable = response.data.data.list;
                            self.page.totalSize = response.data.data.total;
                        }else{
                            self.$message.error(response.data.msg);
                        }
                    })
            },
            //生成基础课程表数据
            createBaseData(){
                var self = this;
                self.fullscreenLoading = true;
                self.axios({
                    method: "get",
                    url: api.syllabusManager.createSyllabusBaseData
                }).then((response)=>{
                        self.fullscreenLoading = false;
                        if(response.data.success){
                            self.getSyllabus();
                        }else{
                            self.$message.error(response.data.msg);
                        }
                    })
            },
            handleSizeChange(val){
                if(isNaN(val)){
                    val = 30;
                }
                this.page.visiblePages = val;
                this.searchGetSyllabus();
            },
            handleCurrentChange(val){
                if(val < 1){
                    val = 1;
                }
                this.page.currentPage = val;
                this.searchGetSyllabus();
            },
            // 点击显示配置课程
            showAddSyllabusDialog(val){
                // console.log("zhixiangle");
                this.$refs.syllabusAdd.showDialog(val);
            },
            // 点击生成课程表
            showgenerateSyllabusDialog(val,baseId){
                this.$refs.syllabusCreate.showDialog(val,baseId);
            },
            // 点击生成课程表
            showEditSyllabusDialog(val){
                this.$refs.syllabusEdit.showDialog(val);
            },
            // 点击查看课程表
            showgeneratesyllabusDetails(val){
                this.$refs.syllabusDetails.showDialog(val);
            },
            // 点击重置课程表
            resetSyllabus(val){
                let self = this;
                this.$confirm('此操作将重置该课程表, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {  //确认删除课程表
                    self.axios.delete(api.syllabusManager.syllabusbase + val.id).then((response) => {
                        if(response.data.success){
                            // 更新列表
                            self.getSyllabus();
                            // 重置成功打开添加页面
                            // self.$refs.syllabusAdd.showDialog(val);
                        }else{
                            // 操作失败
                            self.$message({
                                message: response.data.msg,
                                type:'error',
                                center: true
                            });
                        }

                    });
                }).catch(() => {
                    // 取消弹层
                })
            },
            // 点击调课
            showsyllabusChangCourse(val){
                this.$refs.syllabusChangCourse.showDialog(val);
            },
            // 增加堂课
            showsyllabusAddLesson(val){
                this.$refs.syllabusLesson.showDialog(val);
            }
        },
    };
</script>
<style scoped>

</style>